
//获取搜索按钮
var searchBtn = document.querySelector('.right>.button');
//获取输入框
var inputEle = document.querySelector('.right>.text');

//点击搜索按钮, 发起ajax请求, 传参数给服务器端, 服务器端返回搜索的结果
searchBtn.onclick = ()=>{
    axios.get( '/user/search', { params:{ searchkey: inputEle.value  }  } ).then((res)=>{
        render( res.data.list );
        console.log(res.data);
    })
}

//渲染列表
function render(data){
    var str = ''
    
    str = data.map((item,index)=>{
        return `<tr>
                    <td>${item.email}</td>
                       <td>${item.name}</td>
                       <td>${item.phone}</td>
                       <td>${item.ingroup}</td>
                       <td>${item.isadmin?'是':'否'}</td>
                       <td> <span class="statusok">${item.status?'正常':'异常'}</span> </td>
                       <td> <span>编辑</span> <span>删除</span> </td>
                   </tr>`
    }).join('')

    if( str == '' ){
        str = '<ul style="text-align:center;color:red">未查询到数据!</ul>'
    }
    document.querySelector('tbody').innerHTML = str;
    

}

//axios是从axios.min.js文件中暴露的 用来发送ajax请求的一个对象
var page =1
var before=document.querySelector('.before')
console.log(before);
axios.get('/user/list', { params: { page:1,count:1 }  } ).then((res)=>{
    render( res.data.list );
    console.log(res.data);
})
before.onclick=()=>{
   if(page>1){
    axios.get('/user/list', { params: { page:--page,count:1 }  } ).then((res)=>{
        render( res.data.list );
        console.log(res.data);
    })
   }
}
var next=document.querySelector('.next')
next.onclick=()=>{
    axios.get('/user/list', { params: { page:++page,count:1 }  } ).then((res)=>{
        render( res.data.list );
        console.log(res.data);
    })
}
axios.post('/user/login', { phone:'13611129070',pass:'1234' } ).then((res)=>{
    console.log(res.data);
})

